﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>患者信息</title>

    <link rel="shortcut icon" href="favicon.ico">
    <script src="~/vue/axios.min.js"></script>
    <script src="~/vue/vue.min.js"></script>
    <script src="~/vue/qs.min.js"></script>
    <link href="~/layui/css/layui.css" rel="stylesheet" />
    <script src="~/layui/layui.js"></script>
    <script src="~/BootstrapS/js/plugins/layer/laydate/laydate.js"></script>
    <link href="~/BootstrapS/css/plugins/iCheck/custom.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
    <link href="~/BootstrapS/css/bootstrap.min14ed.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/font-awesome.min93e3.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/animate.min.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/style.min862f.css" rel="stylesheet" />

    <script src="~/BootstrapS/js/jquery.min.js"></script>
    <script src="~/BootstrapS/js/bootstrap.min.js"></script>
    <script src="~/BootstrapS/js/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="~/BootstrapS/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
    <script src="~/BootstrapS/js/plugins/layer/layer.min.js"></script>
    <script src="~/BootstrapS/js/hplus.min.js"></script>
    <script src="~/BootstrapS/js/contabs.min.js"></script>
    <script src="~/BootstrapS/js/plugins/pace/pace.min.js"></script>

</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight" id="vue_div">
        <div class="row">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <input type="text" placeholder="请输入关键词" v-model="patient.name" class="input-sm form-control" style="width:180px;height:34px">
                    <button class="btn btn-info " type="button" v-on:click="getbyname" style="margin-left:190px;margin-top:-48px">
                        <i class="fa fa-paste"></i> 查询
                    </button>
                    <button class="btn btn-info " type="button" href="/Patient/AddPatients" data-toggle="modal" data-target="#addPatient" style="margin-left:190px;margin-top:-48px">
                        <i class="fa fa-paste"></i> 添加患者
                    </button>
                </div>
                <div class="ibox-content">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th></th>
                                <th>编号</th>
                                <th>患者姓名</th>
                                <th>性别</th>
                                <th>年龄</th>
                                <th>就诊科室</th>
                                <th>联系方式</th>
                                <th>就诊时间</th>
                                <th>当前状态</th>
                            </tr>
                        </thead>

                        <tr v-for="item in info">
                            <td></td>
                            <td>{{item.patient_Num}}</td>
                            <td>{{item.patient_Name}}</td>
                            <td>{{item.patient_Sex==0?"男":"女"}}</td>
                            <td>{{item.patient_Age}}</td>
                            <td>{{item.outpatient_Name}}</td>
                            <td>{{item.patient_IPhone}}</td>
                            <td>{{item.patient_Date}}</td>
                            <td>{{item.patient_State==1?"待就诊":item.patient_State==2?"就诊中":item.patient_State==3?"已完成":"取消"}}</td>
                            <td><button type="button" class="btn btn-outline btn-warning" href="/Patient/UpdatePatient" style="margin-right:10px" data-toggle="modal" v-on:click="updatepatient(item.patient_Id)" data-target="#myPatient">编辑信息</button></td>
                        </tr>
                    </table>
                    <!--分页-->
                    <div class="btn-group" style="margin-left:45%">
                        <button type="button" v-on:click="first" class="btn btn-white">
                            <i class="fa fa-chevron-left"></i>
                        </button>

                        <button type="button" v-on:click="next" class="btn btn-white">
                            <i class="fa fa-chevron-right"></i>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--修改患者信息 模态框（Modal） -->
    <div class="modal fade animated flipInY" id="myPatient" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="margin-right: 230px">
        <div class="modal-dialog">
            <div class="modal-content" style="width:140%">
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <!--添加患者信息 模态框（Modal） -->
    <div class="modal fade animated flipInY" id="addPatient" tabindex="-1" role="dialog" aria-labelledby="myModalPatient" aria-hidden="true" style="margin-right: 230px">
        <div class="modal-dialog">
            <div class="modal-content" style="width:140%">
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</body>
</html>

<script>
    new Vue({
        el: '#vue_div',
        data() {
            return {
                info: null,
                pageindex: 1,
                pagesize: 10,
                pagecount: 0,
                patient: {
                    name: ""
                }
            }
        },
        mounted: function () {
            axios
                .get('/Patient/GetPatient', { params: { name: this.patient.name, pageIndex: this.pageindex, pageSize: this.pagesize } })
                .then(response => (this.info = response.data.patient, this.pagecount = response.data.pageCount))
                .catch(function (eatch) {//请求失处理
                    console.log(eatch);
                })
        },
        methods: {
            getbyname: function () {
                axios
                    .get('/Patient/GetPatient', { params: { name: this.patient.name, pageIndex: this.pageindex, pageSize: this.pagesize } })
                    .then(response => (this.info = response.data.patient, this.pagecount = response.data.pageCount))
                    .catch(function (eatch) {
                        console.log(eatch);
                    })
            },
            first: function () {
                if (this.pageindex == 1) {
                    swal({
                        title: "已经是首页了",
                        text: "",
                        type: "warning",
                        confirmButtonText: "确定",
                        closeOnConfirm: false
                    })
                    return;
                }
                this.pageindex = this.pageindex - 1;
                this.getbyname();
            },
            next: function () {
                if (this.pageindex == this.pagecount) {
                    swal({
                        title: "已经是尾页了",
                        text: "",
                        type: "warning",
                        confirmButtonText: "确定",
                        closeOnConfirm: false
                    })
                    return;
                }
                this.pageindex = this.pageindex + 1;
                this.getbyname();
            },
            updatepatient: function (pid) {
                sessionStorage["pid"] = pid;
            }

        }
    })
</script>